@import '~styles/settings.scss';

$explore-nav-height: rem(40px);

.c-explore {
  .content {
    height: calc(100vh - #{$explore-nav-height});
    position: relative;

    @media screen and (min-width: $screen-m) {
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
      padding: 0 rem(10px);
    }

    .description {
      p {
        font-size: 12px;
        line-height: 1.6;
        margin: rem(10px) 0;
      }

      a {
        color: $green-gfw;
      }

      @media screen and (min-width: $screen-m) {
        margin: rem(30px) 0 0;
      }

      .ptw-type-intro {
        display: inline-block;
        margin-right: rem(10px);
      }

      .ptw-type-selector {
        display: inline-block;
      }
    }

    .map-card {
      // margin-bottom: rem(30px);
    }
  }

  .column,
  .columns {
    padding-right: rem(15px);
    padding-left: rem(15px);
    margin-bottom: rem(30px);
  }
}
